import 'package:enjoy_plus_hm/pages/home/index.dart';
import 'package:enjoy_plus_hm/pages/mine/index.dart';
import 'package:enjoy_plus_hm/utils/eventBus.dart';
import 'package:enjoy_plus_hm/utils/token.dart';
import 'package:flutter/material.dart';

// 定义一个状态ful的TabBar页面组件
class TabBarPage extends StatefulWidget {
  const TabBarPage({super.key});

  @override
  State<TabBarPage> createState() => _TabBarPageState();
}

// TabBar页面的状态管理类
class _TabBarPageState extends State<TabBarPage> {
  // 记录当前索引
  int currentIndex = 0;

  // 底部TabBar数据
  List tabBarList = [
    {
      "title": "首页",
      "default": "assets/tabs/home_default.png",
      "active": "assets/tabs/home_active.png",
    },
    {
      "title": "我的",
      "default": "assets/tabs/my_default.png",
      "active": "assets/tabs/my_active.png",
    },
  ];

  @override
  void initState() {
    super.initState();
    // TokenManager().init();
    //初始化token,但是返回的是异步的,无法用async和await
    //除了再定义一个方法外,还可以用这种方法
    //延迟0秒执行初始化token
    Future.delayed(Duration.zero, () async {
      await TokenManager().init();
      //测试打印token
      print(TokenManager().getToken());
    });

    //注册eventBus监听事件
    event.on<LogoutEvent>().listen((e) {
      print(e.message); //监听到事件并且拿到传递的参数
      //跳转到登录页
      // ToastUtil.showError('登录失效,请重新登录!');
      // Navigator.of(context).pushNamed('/login');
      Navigator.pushNamed(context, '/login');
    });
  }

  // 生成BottomNavigationBarItem列表
  List<BottomNavigationBarItem> barItemList() {
    List<BottomNavigationBarItem> items = [];
    for (var item in tabBarList) {
      items.add(
        BottomNavigationBarItem(
          icon: Image.asset(item['default'], width: 32, height: 32),
          activeIcon: Image.asset(item['active'], width: 32, height: 32),
          label: item['title'],
        ),
      );
    }
    return items;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        /**
       * 主要内容区域，确保内容不会被操作系统界面（如状态栏和导航栏）遮挡。
       * 使用IndexedStack来管理多个页面，根据currentIndex显示对应的页面。
       * SafeArea主要是安卓和iOS鸿蒙的安全区
       */
        child: IndexedStack(
          /*
          IndexedStack 可以根据下标进行切换
          index 就是放切换的下标
          children 就是放切换的页面
          */
          index: currentIndex,
          children: [
            HomePage(),
            MinePage(currentIndex: currentIndex),
          ],
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        /**
       * 底部导航栏，提供导航项供用户选择。
       * 使用BottomNavigationBarType.fixed类型以支持多个导航项。
       * 导航项由barItemList()提供，选中项颜色和未选中项颜色被设置以区分状态。
       * 当用户点击导航项时，通过更改currentIndex来更新显示的页面。
       * bottomNavigationBar和body平齐的哦~~
       * type设置底部导航条的动画
       * currentIndex: 当前选中的导航项索引
       * onTap: 点击导航项时触发
       * selectedItemColor: 选中项颜色
       * unselectedItemColor: 未选中项颜色
       */
        type: BottomNavigationBarType.fixed,
        items: barItemList(),
        currentIndex: currentIndex,
        selectedItemColor: const Color.fromARGB(255, 85, 145, 175),
        unselectedItemColor: Colors.black,
        onTap: (index) {
          setState(() {
            currentIndex = index;
          });
        },
      ),
    );
  }
}
